<template>
    <ynet-content id="bankLimit" :headerInformation="true" :headerMenu="true">
        <div class="main-container"><!--提示当前位置-->
			<ynet-breadcrumb></ynet-breadcrumb>
		</div>
        <div class="main-container" v-if="main">
            <div>
                <el-form ref="queryForm" :model="queryForm" class="formEmbedTable mt20" :rules="rules">
                    <table>
                        <caption>Enquiry</caption>
                        <tr>
                            <td>Channel</td>
                            <td >
                                <el-form-item prop="paramChannel">
                                    <el-select v-model="queryForm.paramChannel" clearable>
                                        <el-option v-for="item in paramChannels" :label="item.label" :value="item.value" :key="item.value">

                                        </el-option>
                                    </el-select>
                                </el-form-item>
                            </td>	
                            <td>TBS A/C No.</td>
                            <td >
                                <el-form-item prop="accNo">
                                    <el-input v-model="queryForm.accNo"></el-input>
                                </el-form-item>
                            </td>					
                        </tr>
                    </table>
                </el-form>
            </div>
            <div class="btnArea mt20 tac">
                <el-button type="primary" @click="query()">Search</el-button>
            </div>
            <div class="tableForm mt20  tableData">
                <el-table :data="accLimitList" border>
                    <el-table-column label="custom type" prop="cstType" align="center">
                        <template scope="scope">
                            {{scope.row.cstType==0?"personal":"company"}}
                        </template>
                    </el-table-column>
                    <el-table-column label="Channel" prop="paramChannel" align="center">
                        <template scope="scope">
                            {{$tools.dict.getChannel(scope.row.paramChannel)}}
                        </template>
                    </el-table-column>
                    <el-table-column label="Account No." prop="accNo" align="center"></el-table-column>
                    <el-table-column label="Currency" prop="currType" align="center">
                        <template scope="scope">
                            {{$tools.dict.currTypeDict(scope.row.currType)}}
                        </template>
                    </el-table-column>
                    <el-table-column label="Limit Type" prop="limitType" align="center">
                        <template scope="scope">
                            {{$tools.dict.getLimitType(scope.row.limitType)}}
                        </template>
                    </el-table-column>
                    <el-table-column label="Single Limit" prop="limitSingle" align="center">
                        <template scope="scope">
                            {{$tools.utils.currencyFormat(scope.row.limitSingle)}}
                        </template>
                    </el-table-column>
                    <el-table-column label="Daily Limit" prop="limitDay" align="center">
                        <template scope="scope">
                            {{$tools.utils.currencyFormat(scope.row.limitDay)}}
                        </template>
                    </el-table-column>
                    <el-table-column label=" Daily amount Limit" prop="dayNum" align="center">
                        
                    </el-table-column>
                    <el-table-column label="Year Limit" prop="limitYear" align="center">
                        <template scope="scope">
                            {{$tools.utils.currencyFormat(scope.row.limitYear)}}
                        </template>
                    </el-table-column>
                    <el-table-column label="Status" prop="status" align="center">
                        <template scope="scope">
                            {{$tools.dict.getLimitStt(scope.row.status)}}
                        </template>
                    </el-table-column>
                    <el-table-column label="Action" align="center">
                        <template scope="scope">
                            <a class="cBlue" @click="updateLimit(scope.row)">Modify</a> | <a class="cBlue" @click="tanchuang(scope.row)">Delete</a>
                        </template>
                    </el-table-column>
                </el-table>
            </div>
            <div class="pagination tar mt20">
                <el-pagination  @current-change="handleCurrentChange" :current-page="Number(queryForm.currentPage)" :page-size="Number(queryForm.turnPageShowNum)" layout="total, prev, pager, next, jumper" :total="Number(turnPageTotalNum)">
                </el-pagination>
            </div>
            <div class="btnArea mt20 tac">
                <el-button type="primary" @click="bankLimitAdd()">Add</el-button>
            </div>
        </div>
        <div class="main-container" v-if="isAdd">
            <AccLimitAdd @back="back"></AccLimitAdd>
        </div>
        <!--修改区域-->        
        <div class="pt20" v-if="isEdit">
            <AccLimitEdit @back="back" :editForm="editForm"></AccLimitEdit>
        </div>
        <!--授权确认页面弹窗-->
        <div>
            <ynet-authDialog ref="dialogTable"  @getAuthForm="getAuthForm"></ynet-authDialog>
        </div>
        
        
    </ynet-content>
</template>

<script>
    import AccLimitAdd from './components/accLimitAdd';
    import AccLimitEdit from './components/accLimitEdit';
    //import AccessAdd from './components/accessAdd';
	export default {
		name:'bankLimit',
		components:{
          AccLimitAdd,
          AccLimitEdit,
          //QueryHead,
		},
		data(){
            return { 
                main:true,turnPageTotalNum:'',dialogTableVisible:false,
                isAdd:false,
                isEdit:false,
                accLimitList:[],//从后台查询到的白名单集合
                rules:{

                },
                paramChannels:[
                    {label:'Phone Bank',value:'CPB'},
                    {label:'Enterprise online bankingr',value:'CCB'},
                ],
                needAuth:'',
                authType:'', 
                editForm:{},
                delForm:{
                    bsnCode:'IM0501',actionType:'2',userNo:'0000001',
                },
                authForm: { authUserNo: '', password: '',randomField:''},//100004   617100
                queryForm:{
                    paramChannel:'',accNo:'',bsnCode:'IM0501',currentPage:'1',turnPageShowNum:'10'
                },
            }   
        },
		methods:{ 
            handleCurrentChange(val) {//查询分页方法
                this.queryForm.currentPage=val;
                this.queryChange()
            },
            resetForm(formName){
                    this.$refs[formName].resetFields();
            },
            getAuthForm(val){
                    //获取授权数据
                    this.authForm=val;
                    console.log("val:"+JSON.stringify(val))
                    this.delForm=$.extend(this.delForm,this.authForm)
                    this.delAccess()  //自己页面提交给后台的.do方法
                },
            tanchuang(val){
                this.delForm=$.extend({},this.delForm,val);
                console.log("delForm:"+JSON.stringify(this.delForm))
                this.$confirm('Confirm to delete','warning',{
                    confirmButtonText:'Confirm',
                    cancelButtonText:'Cancel',
                    type:'warning'
                }).then(()=>{
                    this.queryAuth();
                }).catch(()=>{

                })
            },
            queryAuth(){//查询授权模式
               
                let body={};body.bsnCode="IM0501";body.version="IM0501",
                this.$tools.request(this,"IM010001Action.do",body).then(data=>{
                    if(data.body.errorCode==0){
                        if(data.body.needAuth==0){//无需授权
                            this.delAccess()
                        }else if(data.body.needAuth==1 && data.body.authType==1){
                            this.needAuth=1;
                            this.authType=1;
                            this.$refs["dialogTable"].show()
                                    // this.dialogTableVisible=true;
                        }else if( data.body.needAuth==1 && data.body.authType==2 ){
                             this.needAuth=1;
                            this.authType=2;
                            this.delAccess()
                        }else{
                            this.$alert('Authorization Type Error', {
                                confirmButtonText: 'Confirm',
                                callback: action => {
                                }
                            });
                        }
                    }else{
                        this.$alert("System Error Try again", "warning",{
                            confirmButtonText: 'Confirm',
                            callback: action => {
                            }
                        })
                    }
                })   
			},
            delAccess(val){//删除
                this.$tools.request(this,"IM0501Action.do",this.delForm).then(data=>{
                    if(data.body.errorCode==0){
                        if(this.needAuth==1 && this.authType==2){
                            this.$message({
								type:'success',
								message:'Waiting for Authorized'
							})
                            this.queryChange()
                        } else if(this.needAuth==1 && this.authType==1){
                            if(data.body.authStatus==1){
                                this.$message({
                                    type:'warning',
                                    message:'Authorship No. or password wrong ,please resume load',
                                    showClose:true,
                                })
                                this.queryChange()
                            }else{
                                 this.$message({
                                    type:'success',
                                    message:'Delete Success',
                                    showClose:true,
                                })
                                this.queryChange()
                            }
                        }else{
                            this.$message({
                                type:'success',
                                message:'Delete Success',
                                showClose:true,
                            })
                            this.queryChange()
                        }
                        
                    }else{
                        this.$alert("System Error Try again", "warning",{
                            confirmButtonText: 'Confirm',
                            callback: action => {
                            }
                        })
                    }
                })
           },
           bankLimitAdd(){//点击新增按钮,显示新增页面
             this.main=false;
             this.isAdd=true;
             this.isEdit=false;
             
           },
           updateLimit(val){//点击修改按钮,反显选中的数据
                console.log("updatval:"+JSON.stringify(val))
                this.editForm=$.extend({},this.editForm,val)
                this.main=false;
                this.isAdd=false;
                this.isEdit=true;
           },
           queryChange(){
                this.$tools.request(this,"IM0501QueryAction.do",this.queryForm).then(data=>{
                   console.log("data:"+JSON.stringify(data))
                   if(data.body.errorCode==0){
                        this.accLimitList=data.body.accLimitList;
                        this.turnPageTotalNum=data.body.turnPageTotalNum;
                   }else{
                       this.$alert("System Error Try again", "warning",{
                            confirmButtonText: 'Confirm',
                            callback: action => {
                            }
                        })
                   }
               })
           },
           query(){//查询频率控制
                //console.log("val:"+JSON.stringify(val))
                this.queryForm.currentPage=1
                console.log("queryForm:"+JSON.stringify(this.queryForm))
                this.queryChange()
            },
            back(){
                this.main=true;
                this.isAdd=false;
                this.isEdit=false;
                this.queryChange();
            }
            
		}
	}
</script>